<template>
 <div>
    <!--工具条-->
    <el-col
      :span="24"
      class="toolbar"
      style="padding-bottom:0;display: flex; justify-content: space-between">
       <el-form :inline="true">
   
        <el-form-item prop="userId">
          <el-input
            v-model="riskselectDat.uid"
            :placeholder="$t('iptdefault.uid')"
          ></el-input>
        </el-form-item>

        <el-select
          v-model="riskselectDat.type"
          :placeholder="$t('iptdefault.status')"
        >
          <el-option
            v-for="item in optionrickSelect"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>

           <el-form-item :label="$t('iptdefault.timeselect')">
            <el-col :span="11">
              <el-date-picker type="date" :placeholder="$t('iptdefault.starttime')" v-model="riskselectDat.start" style="width: 100%;"></el-date-picker>
            </el-col>
          
          <el-col class="line" :span="2" style="text-align: center">-</el-col>
            <el-col :span="11">
              <el-date-picker type="date" :placeholder="$t('iptdefault.endtime')" v-model="riskselectDat.end" style="width: 100%;"></el-date-picker>
            </el-col>
          </el-form-item>

        <el-form-item>
          <el-button type="primary" @click="getUserRiskSubmit">{{$t('publicbtn.query')}}</el-button>
        </el-form-item>

          <el-form-item>
          <el-button type="primary" @click="getUserRiskRefresh">{{$t('publicbtn.refresh')}}</el-button>
        </el-form-item>
    
      </el-form>
  
      <el-form :inline="true" style="display:flex;align-item:center;">
        <el-form-item>
          <el-button type="primary" @click="exportexcel">{{$t('publicbtn.exportalldata')}}</el-button>
        </el-form-item> 
       <excelexport></excelexport>
      </el-form>
      
    </el-col>

    <!-- table -->
        <el-table
      v-loading="loading"
      :data="userRiskData"
      style="width: 100%"
      id="out-table"
    >
   <el-table-column prop="userId" :label="$t('field.userid')"> </el-table-column>
    <el-table-column prop="username" :label="$t('field.cellphone')"></el-table-column> 
    <el-table-column prop="name" :label="$t('field.upusername')"></el-table-column>
 

    <el-table-column prop="crypto" :label="$t('field.digitalcurrencys')"></el-table-column>

    <el-table-column prop="amount" :label="$t('field.totalbalance')" >
      <template slot-scope="props">
        {{ (props.row.amount / million).toFixed(8) }}
      </template>
    </el-table-column>

    
    <el-table-column prop="amount" :label="$t('field.dollarequivalent')" >
      <template slot-scope="props">
        {{ 
          websocketDataps[props.row.crypto.replace("_V1","")+'USDT']?
          (websocketDataps[props.row.crypto.replace("_V1","")+'USDT']['a'] * (props.row.amount / million).toFixed(8)).toFixed(2)
          : (props.row.amount / million).toFixed(2)
          
           }}
      </template>
    </el-table-column>




    <el-table-column  :label="$t('field.upbalance')">
    <template slot-scope="props">
      {{ ((props.row.amount - props.row.lockAmount ) / million).toFixed(8) }}
    </template>
    </el-table-column>
      

      <el-table-column prop="amount" :label="$t('field.dollarequivalent')">
      <template slot-scope="props">
        {{ 
          websocketDataps[props.row.crypto.replace("_V1","")+'USDT']?
          (websocketDataps[props.row.crypto.replace("_V1","")+'USDT']['a'] *  ((props.row.amount - props.row.lockAmount ) / million).toFixed(8)).toFixed(2)
          :  ((props.row.amount - props.row.lockAmount ) / million).toFixed(2)
          
           }}
      </template>
    </el-table-column>

    <el-table-column prop="lockAmount" :label="$t('field.lockAmount')" >
      <template slot-scope="props">
        {{ (props.row.lockAmount / million).toFixed(8) }}
      </template>
    </el-table-column>
    
    <el-table-column prop="type:" :label="$t('field.wallettype')" >
      <template slot-scope="props">
        {{
          props.row.type == 1
            ? $t('field.appWallet')
            : props.row.type == 2
            ? $t('field.otcWallet')
            : ""
        }}
      </template>
    </el-table-column>

       <el-table-column prop="createAt" :label="$t('dayend.time')">
      </el-table-column>

       
    </el-table>

        <!--分页 -->
    <div class="pagination">
      <el-pagination
        background
        layout="prev, pager, next"
        :total="userrisktTotal"
        :page-size='riskselectDatCopy.size'
        @current-change="current_changes"
        :current-page="riskselectDatCopy.page"
        >
      </el-pagination>
    </div>
 </div>
  
</template>

<script>
import excelexport from "@/components/export.vue";
import exportData from "@/components/export.js";

import { getUserRequest, postUserRequest, getNudataRequest } from "@/api/api";
export default {
  name: "riskment",
  components: {
    excelexport,
  },
  data(){
      return{
      million:100000000,
        userrisktTotal:null,
        loading:true,  
      //   optionrickSelect: [
      //     {
      //       value: 1,
      //       label: "app 钱包",
      //     },
      //     {
      //       value: 2,
      //       label: "OTC 钱包",
      //     },
      // ],
        riskselectDat:{
          page:1,
          size:10,
          uid:'',
          start:'',
          end:'',
          type:1
        },
        riskselectDatCopy:{
          page:1,
          size:10,
          uid:'',
          start:'',
          end:'',
          type:''
        },
        userRiskData:[]
      }
  },



  computed:{
optionrickSelect:function(){
  return [
          {
            value: 1,
            label: this.$t('field.appWallet'),
          },
          {
            value: 2,
            label:  this.$t('field.otcWallet'),
          },
      ]
},
tableData:function(){
  return[[
    this.$t('field.userid'),this.$t('field.cellphone'),this.$t('field.upusername'), this.$t('field.digitalcurrencys'),this.$t('field.totalbalance'),this.$t('field.dollarequivalent'), this.$t('field.upbalance'),this.$t('field.dollarequivalent'),this.$t('field.lockAmount'),this.$t('field.wallettype'),this.$t('dayend.time')
   ]] 
  },
       websocketDataps(){
          return this.$store.state.websocketDataps
      },
    
  },
  methods:{
    getUserRiskSubmit(){
      this.riskselectDat.page=1;
      this.riskselectDatCopy=JSON.parse(JSON.stringify(this.riskselectDat));
      if(this.riskselectDat.start!='') this.riskselectDatCopy.start = (new Date(this.riskselectDat.start)).getTime();
      if(this.riskselectDat.end!='') this.riskselectDatCopy.end = (new Date(this.riskselectDat.end)).getTime();
      this.getRiskData()
    },
    getUserRiskRefresh(){
      this.riskselectDatCopy.page=1
      
      this.getRiskData()
    },
    current_changes(pager){
      this.riskselectDatCopy.page=pager;
      this.getRiskData()
    },

    getRiskData(){
       this.loading=true;
      getUserRequest(this.riskselectDatCopy,'/getDayEndTradeWallet').then(res=>{
        var data=res.data;
        if(data.code ==200){
        this.userRiskData = data.data.list;
        
        
        this.userrisktTotal = data.data.total;
        }else{
          this.$message({
              message: data.message,
              type: "error",
            });
        }
             this.loading= false;

      })
    },
    // 导出全部
    exportexcel(){
          // title
    let tableData = this.tableData
    // [ ['用户ID','手机号','用户名称', '数据货币','总余额', '可用余额','锁定余额','钱包类型','时间']  ] 
      //要取得字段
    let tableDatatilte = 
              ['userId','username', 'name','crypto', 'amount', 'usdollar1',  'availablebalance','usdollar2','lockAmount','type','createAt']//导出字段
    
    let exportTime ={start:'',end:'',uid:'',page:1,size:this.million,type:this.riskselectDat.type}
        exportTime.uid = this.riskselectDat.uid
        exportTime.start = JSON.parse(JSON.stringify(this.riskselectDat.start))
        exportTime.end = JSON.parse(JSON.stringify(this.riskselectDat.end))
        let start = exportTime.start
        let end = exportTime.end
        if(start&&end){
          let _this = this
          if(this.riskselectDat.start!='') exportTime.start = (new Date(start)).getTime();
          if(this.riskselectDat.end!='') exportTime.end = (new Date(end)).getTime();
            getUserRequest(exportTime,'/getDayEndTradeWallet').then(res=>{
              var data = res.data
              console.log(_this.websocketDataps)
              if(data.code == 200){
                var datalist = data.data.list
              for(let i=0;i<datalist.length;i++){
                  datalist[i]['availablebalance'] =( (datalist[i]['amount'] - datalist[i]['lockAmount']) / _this.million).toFixed(8)
                  datalist[i]['amount'] = (datalist[i]['amount'] / _this.million).toFixed(8)
                  datalist[i]['lockAmount'] =( datalist[i]['lockAmount'] / _this.million).toFixed(8)
                  
                  
       datalist[i]['usdollar1'] = _this.websocketDataps[datalist[i]['crypto'].replace("_V1","")+'USDT']?
          (_this.websocketDataps[datalist[i]['crypto'].replace("_V1","")+'USDT']['a'] * (datalist[i]['amount'] / 1).toFixed(8)).toFixed(2)
          : (datalist[i]['amount'] / 1).toFixed(2)


     datalist[i]['usdollar2'] =_this.websocketDataps[datalist[i]['crypto'].replace("_V1","")+'USDT']?
          (_this.websocketDataps[datalist[i]['crypto'].replace("_V1","")+'USDT']['a'] *  (datalist[i]['amount'] - datalist[i]['lockAmount'] ).toFixed(8)).toFixed(2)
          :  (datalist[i]['amount'] - datalist[i]['lockAmount']).toFixed(2)
          

            //       if(this.websocketDataps[datalist[i]['crypto'].replace("_V1","")+'USDT']){
            //      datalist[i]['usdollar1'] = this.websocketDataps[datalist[i]['crypto'].replace("_V1","")+'USDT']['a'] *  ((datalist[i]['amount'] / _this.million).toFixed(8)).toFixed(2)
            //       }else{
            //      datalist[i]['usdollar1'] = ([datalist[i]['amount'] ] / _this.million).toFixed(2)
            //       }

            //  if(this.websocketDataps[datalist[i]['crypto'].replace("_V1","")+'USDT']){
            //     datalist[i]['usdollar2'] = this.websocketDataps[datalist[i]['crypto'].replace("_V1","")+'USDT']['a'] *  ((datalist[i]['amount'] - datalist[i]['lockAmount'] ) / _this.million).toFixed(8).toFixed(2)
            //       }else{
            //     datalist[i]['usdollar2'] = ([datalist[i]['amount'] - datalist[i]['lockAmount']] / _this.million).toFixed(2)
            //       }

        
        
                  
                  
                  if( datalist[i]['type'] == 1){
                    datalist[i]['type'] = this.$t('field.appWallet')
                  }else if( datalist[i]['type'] == 2){
                    datalist[i]['type'] = this.$t('field.otcWallet')
                  }
                }
             
             
                  let exportName = this.$t('export.dayendName')
                  exportData.exportTable(datalist,tableData,tableDatatilte,exportName)
              }else{
              this.$message({
                    message: data.message,
                    type: "error",
                  }); 
              }
            })
            }else{
              this.$message({
                message: this.$t('bulletframe.selecttime'),
                type: "error",
              });
            }



      
      
    }

  },
  mounted(){
    this.getRiskData()
  }

}
</script>

<style scoped>


.pagination {
  text-align: center;
  margin-top: 20px;
}

</style>